<template>
  <v-card class="basicInfo">
    <!--公司简介-->
    <div class="introduce">
      <!-- <el-button class="i-btn" type="primary" @click="handleClick"
        >查看更多信息</el-button
      > -->
      <p class="infoTitle">{{ introduceData.title }}</p>
      <div class="introduceContent">
        {{ introduceData.content || nothingText }}
      </div>
      <!-- 结论 -->
      <!-- <v-btn class="right-icon" @click="showConclusion(0)">{{$t('assessment.Conclusion')}}</v-btn> -->
    </div>
    <!--工商信息-->
    <div class="business">
      <p class="infoTitle">{{ businessData.title }}</p>
      <div class="businessBody">
        <p>
          <span>{{ $t("assessment.UnifiedSocialCreditCode") }}</span
          ><b>{{ businessData.body.credit_no }}</b>
        </p>
        <p>
          <span>{{ $t("assessment.OperationStatus") }}</span
          ><b>{{ businessData.body.status }}</b>
        </p>
        <p>
          <span>{{ $t("assessment.FoundingDate") }}</span
          ><b>{{ businessData.body.start_date }}</b>
        </p>
        <p>
          <span>{{ $t("assessment.OrganizationCode") }}</span
          ><b>{{ businessData.body.org_no }}</b>
        </p>
        <!--<p><span>所属行业</span><b>{{businessData.body.industry}}</b></p>-->
        <p>
          <span>{{ $t("assessment.OperationPeriod") }}</span
          ><b>{{ businessData.body.term_end }}</b>
        </p>
        <!--<p><span>注册号</span><b>{{businessData.body.reg_no}}</b></p>-->
        <p>
          <span>{{ $t("assessment.CompanyType") }}</span
          ><b>{{ businessData.body.econ_kind }}</b>
        </p>
        <!--<p><span>发照日期</span><b>{{businessData.body.check_date}}</b></p>-->
        <p>
          <span>{{ $t("assessment.LegalRepresentative") }}</span
          ><b>{{ businessData.body.oper_name }}</b>
        </p>
        <p>
          <span>{{ $t("assessment.RegisteredCapital") }}</span
          ><b>{{ businessData.body.regist_capi }}</b>
        </p>
        <p>
          <span>{{ $t("assessment.RegistrationAuthority") }}</span
          ><b>{{ businessData.body.belong_org }}</b>
        </p>
        <p>
          <span>{{ $t("assessment.CompanyAddress") }}</span
          ><b>{{ businessDataAddress }}</b>
        </p>
        <p>
          <span>经营范围</span><b>{{ businessData.body.scope }}</b>
        </p>
      </div>
    </div>
    <!--工商变更-->
    <div
      class="businessChange"
      :class="{ 'business-hide': testData.length <= 0 }"
    >
      <p class="infoTitle">{{ businessChange.title }}</p>
      <div class="changeBody">
        <p class="title">
          <span class="time"
            >{{ sliderLeftTime }}&nbsp;&nbsp;至&nbsp;&nbsp;{{
              sliderRightTime
            }}</span
          >
          <span class="legend">
            <!-- <i>投资方</i>
						<i>撤资方</i> -->
          </span>
        </p>
        <el-carousel
          class="elcarousel"
          trigger="click"
          ref="carousel"
          arrow="never"
          :interval="0"
          :loop="false"
          @change="change"
        >
          <el-carousel-item
            class="elcarousel-item"
            v-for="(item, index) in testData"
            :key="index"
          >
            <div
              v-for="(item2, index2) in testData[index]"
              :key="index2"
              class="card-info clearfix"
            >
              <div
                class="node"
                :class="{
                  'node-bottom': index2 % 2 === 0,
                  'node-top': index2 % 2 !== 0,
                }"
              >
                <i></i>
              </div>
              <div class="abst">
                <p>{{ item2.name.change_date }}</p>
                <p class="detail">
                  <!-- {{item2.name.change_item}} -->
                  <span @click="showDetails(item2)">{{
                    item2.name._info
                  }}</span>
                </p>
                <!-- <p v-if="item2.name.showContent" :title="item2.name.showContent">变更详情</p> -->
              </div>
            </div>
          </el-carousel-item>
        </el-carousel>

        <div id="time-line" class="time-line" ref="timeLine">
          <ul class="scale">
            <li
              v-for="(item, index) in scaleData"
              :key="index"
              :class="{ high: index % 2 === 0 }"
            ></li>
          </ul>
          <div id="box" class="slider-box" ref="box" ondragstart="return false">
            <i>{{ sliderLeftTime }}</i>
            <i>{{ sliderRightTime }}</i>
          </div>
        </div>
        <p class="time-tip clearfix">
          <!-- <span>2008-06-13</span>
					<span>2019-07-18</span> -->
        </p>
      </div>
    </div>
    <!--主要人员-->
    <div class="mainMember">
      <p class="infoTitle">{{ mainMember.title }}</p>
      <div class="memberBody">
        <p
          v-if="mainMember.body.length > 0"
          v-for="(item, index) in mainMember.body"
          :key="index"
        >
          <span>{{ item.job_title }}</span
          ><b>{{ item.name }}</b>
        </p>
        <p v-else>{{ nothingText }}</p>
      </div>
    </div>
    <!--分支机构-->
    <div class="branch">
      <p class="infoTitle">{{ $t("assessment.Branches") }}</p>
      <div class="branchBody">
        <el-table :data="branch.items">
          <el-table-column
            prop="name"
            :label="$t('assessment.EnterpriseName')"
            width="300"
          ></el-table-column>
          <el-table-column
            prop="oper_name"
            :label="$t('assessment.LegalRepresentativePersonInCharge')"
          ></el-table-column>
          <el-table-column
            prop="belong_org"
            :label="$t('assessment.Branches')"
          ></el-table-column>
          <!-- <el-table-column prop="start_date" :label="$t('assessment.FoundingDate')" width="160"></el-table-column>
			      	<el-table-column prop="status" :label="$t('assessment.Status')"></el-table-column> -->
        </el-table>
        <el-pagination
          background
          @current-change="getCurrentPageBranch"
          layout="prev, pager, next"
          :page-size="branch.ips"
          :total="branch.total"
          style="margin-top: 20px"
        >
        </el-pagination>
      </div>
    </div>
    <!--对外投资-->
    <div class="invest">
      <p class="infoTitle">{{ $t("assessment.ForeignInvestment") }}</p>
      <div class="branchBody">
        <el-table v-loading="invest.loading" :data="invest.items">
          <!-- <el-table-column type="expand">
						<template slot-scope="scope">
							<el-table
								:data="scope.row.themeList"
								header-row-class-name="expand-table-header"
								style="width: 100%">
								<el-table-column prop="title" label="子任务名称" align="center"></el-table-column>
								<el-table-column
									prop="createTime"
									label="创建时间"
									align="center"
								></el-table-column>
								<el-table-column prop="userName" label="项目人员" align="center"></el-table-column>
								<el-table-column prop="description" label="简介" align="center"></el-table-column>
							</el-table>
						</template>
					</el-table-column> -->
          <el-table-column
            prop="invest_name"
            :label="$t('assessment.EnterpriseName')"
            width="240"
          ></el-table-column>
          <!-- <el-table-column prop="his_name" :label="$t('assessment.FormerName')" width="240">
			      		<template slot-scope="{row}">
					        <p v-for="(item, index) in row.his_name" :key="index">{{item}}</p>
					    </template>
			      	</el-table-column> -->
          <el-table-column
            prop="invest_oper_name"
            :label="$t('assessment.LegalPersonName')"
          ></el-table-column>
          <el-table-column
            prop="invest_credit_no"
            :label="$t('assessment.RegistrationNo')"
          ></el-table-column>
          <!--<el-table-column prop="reg_capi_desc" label="注册资本"></el-table-column>-->
          <el-table-column :label="$t('assessment.FoundingDate')">
            <template slot-scope="scope">
              <div>
                {{ scope.row.ctrate_time | ctrate_time }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="invest_status"
            :label="$t('assessment.Status')"
          ></el-table-column>
        </el-table>
        <el-pagination
          background
          @current-change="getCurrentPage"
          layout="prev, pager, next"
          :page-size="invest.ips"
          :total="invest.total"
          style="margin-top: 20px"
        >
        </el-pagination>
      </div>
    </div>
    <!-- 变更详情 -->
    <v-dialog v-model="dialogContant" max-width="600px">
      <v-card>
        <v-card-title>
          <span class="headline">{{ $t("assessment.ChangedInfo") }}</span>
        </v-card-title>
        <v-card-text style="padding-top: 0; padding-bottom: 0">
          <ul class="content-list">
            <li v-for="(item, index) in contentList" :key="index">
              {{ item }}
            </li>
          </ul>
        </v-card-text>
      </v-card>
    </v-dialog>
    <!-- 结论 -->
    <el-dialog
      title="分析"
      :visible.sync="isShowConclusion"
      width="1000px"
      class="eldialog2"
    >
      <div class="financTable">
        <p style="margin-bottom: 4px">离职信息：</p>
        <el-table
          v-if="isLayPeople.length > 0"
          :data="layPeopleArr"
          :span-method="objectSpanMethod"
          :cell-style="cellStyle"
          class="eltable2"
          style="margin-top: 20px"
          :cell-class-name="cellStyle2"
          empty-text="无疑似离职"
        >
          <el-table-column type="index" label="序号" width="70">
          </el-table-column>
          <el-table-column prop="name" label="姓名" width="150">
          </el-table-column>
          <el-table-column prop="position" label="原公司职务">
            <template slot-scope="scope">
              <span :title="scope.row.position">{{ scope.row.position }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="patentNum" label="专利数量"> </el-table-column>
          <el-table-column prop="companyName" label="公司/机构">
            <template slot-scope="scope">
              <span :title="scope.row.companyName">{{
                scope.row.companyName
              }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="endDate" label="开始时间" width="150">
          </el-table-column>
          <el-table-column prop="startDate" label="结束时间" width="150">
          </el-table-column>
        </el-table>
        <ul v-if="isNoLayPeople" style="padding-left: 0">
          未发现该公司<span style="color: #3fcd75; cursor: default"
            >核心员工</span
          >离职
        </ul>
      </div>
    </el-dialog>
    <!-- <Conclusion v-show="false"> -->
    <!-- 待接口联调 -->
    <!-- <p style="margin-bottom: 4px;">股东信息：</p>
			<p v-html="ownerShipData"></p> -->
    <!-- <p style="margin-bottom: 4px;">离职信息：</p>
			<el-table
				v-if="isLayPeople.length>0"
				:data="layPeopleArr"
				:span-method="objectSpanMethod"
				:cell-style="cellStyle"
				class="eltable2"
				style="margin-top:20px;"
				:cell-class-name="cellStyle2"
				empty-text="无疑似离职">
				<el-table-column
					type="index"
					label="序号"
					width="70">
				</el-table-column>
				<el-table-column
					prop="name"
					label="姓名"
					width="150">
				</el-table-column>
				<el-table-column
					prop="position"
					label="原公司职务">
				</el-table-column>
				<el-table-column
					prop="patentNum"
					label="专利数量">
				</el-table-column>
				<el-table-column
					prop="companyName"
					label="公司/机构">
				</el-table-column>
				<el-table-column
					prop="startDate"
					label="开始时间"
					width="150">
				</el-table-column>
				<el-table-column
					prop="endDate"
					label="结束时间"
					width="150">
				</el-table-column>
			</el-table> -->
    <!-- <ul style="position:relative;padding-left:0;color: #838895;" v-if="isLayPeople.length>0">
				该公司员工 <li :key="index"  v-for="(item,index) in isLayPeople" style="display: inline-block">
					<span class="falseInfo dShow">{{item.name}}，</span>
				</li>
				<span>疑似离职</span>
			</ul> -->
    <!-- <ul v-if="isNoLayPeople" style="padding-left:0;">
				未发现该公司<span style="color: #3fcd75;cursor: default;">核心员工</span>离职
			</ul> -->
    <!-- </Conclusion> -->
  </v-card>
</template>

<script>
// import Conclusion from "../components/Conclusion";
import { setTimeout } from "timers";
export default {
  components: {
    // Conclusion,
  },
  data() {
    return {
      companyName: this.$cookie.get("companyName") || "", //公司名称
      introduceData: {
        title: this.$t("assessment.CompanyProfile"),
        content: "",
      },
      businessData: {
        title: this.$t("assessment.IndustrialAndCommercialInfo"),
        body: {},
      },
      businessChange: {
        title: this.$t("assessment.IndustrialAndCommercialChanges"),
      },
      mainMember: {
        title: this.$t("assessment.KeyPersonnel"),
        body: [],
      },
      businessDataAddress: "",

      nothingText: "暂无信息",
      testData: [],
      scaleData: [],
      pageNum: 0,
      sliderLeftTime: "",
      sliderRightTime: "",
      dialogContant: false,
      contentList: [], // 工商变更信息

      ownerShipData: [], // 股东穿透数据
      isLayPeople: [], // 离职员工列表
      isNoLayPeople: false, // 是否有员工离职
      layPeople: [],
      layPeopleArr: [],
      spanArr: [],
      isShowConclusion: false,
      invest: {
        // 对外投资
        items: [],
        ipi: 1,
        ips: 5,
        loading: false,
        total: 0,
      },
      branch: {
        items: [],
        ipi: 1,
        ips: 5,
        loading: false,
        total: 0,
      },
      eid: "",
    };
  },
  filters: {
    ctrate_time(val) {
      function zero(val) {
        return val < 9 ? "0" + val : val;
      }
      if (val) {
        let now = new Date(val);
        let time =
          now.getFullYear() +
          "-" +
          zero(now.getMonth() + 1) +
          "-" +
          zero(now.getDate());
        return time;
      }
    },
  },
  mounted() {
    this.eid = localStorage.getItem("eid");
    //公司简介
    this.getBasicInfo(
      this.$Url.basicInfo.selectByName,
      {
        eid: this.eid,
        tid: "17cf0131d82e20dcab260ec2bd87bab9",
        ipi: 1,
        ips: 20,
      },
      (data) => {
        this.introduceData.content =
          data && data.result && data.result[0] && data.result[0].content;
      }
    );
    // 工商信息
    this.getBasicInfo(
      this.$Url.basicInfo.selectByName,
      {
        eid: this.eid,
        tid: "33ae4d5cd5b5e5f65aa89144791c4a70",
        ipi: 1,
        ips: 20,
      },
      (data) => {
        if (data.result && data.result.length > 0) {
          this.businessData.body = data.result[0];
        }
      }
    );
    // 企业地址
    this.getBasicInfo(
      this.$Url.basicInfo.selectByName,
      {
        eid: this.eid,
        tid: "7c2b74abeec210e0b43dacb246c72cbb",
        ipi: 1,
        ips: 20,
      },
      (data) => {
        let result = data.result || [];
        let address = result.filter((item) => item.source === "注册地址");
        if (address.length) this.businessDataAddress = address[0].address;
      }
    );
    //主要人员
    this.getBasicInfo(
      this.$Url.basicInfo.selectByName,
      {
        eid: this.eid,
        tid: "06ba63698abb12b6eb5b815b6b11bb2a",
        ipi: 1,
        ips: 100,
      },
      (data) => {
        this.mainMember.body = data.result;
        return;
        var list = [];
        if (data.employees.length > 0) {
          data.employees.forEach((item) => {
            if (item.length > 0) {
              item.forEach((temer) => {
                list.push(temer);
              });
            }
          });
          this.mainMember.body = list;
        }
      }
    );
    // 对外
    this.getInvest();
    // 分支子机构
    this.getBranch();
    this.commercialChange();
    // 结论-股东穿透数据
    // this.ownerShip()it
    // 结论-公司是否有员工离职
    this.isHaveDeparture();
  },
  methods: {
    handleClick() {
      // console.log("businessData",this.businessData.body);
      // return;
      // this.$get(this.$Url.EI.qccToken).then((res) => {
      //   let data = res.data;
      //   // console.log(data);
      //   let originUrl = `https://pro-plugin.qcc.com/plugin-login?key=d31a397da54111eea3f10c42a106ce72&token=${data}&returnUrl=/company-gateway?keyword=${this.businessData.body.name || this.businessData.body.format_name}&exactMatchFlag=Y`;
      //   window.open(originUrl);
      // });
      let routerUrl = this.$router.resolve({
        name: "EIQy",
        query: {
          name:
            this.businessData.body.name || this.businessData.body.format_name,
        },
      });
      window.open(routerUrl.href, "_blank");
    },
    // 获取公司简介除外的基本信息
    getBasicInfo(urls, getdata, callback) {
      this.$post(urls, getdata)
        .then((data) => {
          if (data.status == 200 && data.data) {
            callback && callback(data.data);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 分页获取对外投资
    getCurrentPage(val) {
      if (val) {
        this.invest.ipi = parseInt(val);
        this.getInvest();
      }
    },
    // 结论
    showConclusion() {
      this.isShowConclusion = true;
      // this.$Bus.$emit('isShowConclusion', true)
    },
    // 股东穿透数据
    ownerShip() {
      this.$get(this.$Url.basicInfo.Ownership, {
        company: this.companyName,
      })
        .then((data) => {
          let str = "";
          for (let i in data.message) {
            let name = data.message[i].message[0].path;
            let percent = data.message[i].message[0].percent.toFixed(6);
            name = name.split("-->")[0].split("(")[0] + `(${percent})`; // 必须是小写括号，与后台数据保持一致
            str += `<i style="font-style:normal;color:red">${i}最大股东</i>：<span>${name}</span><br>`;
          }
          this.ownerShipData = `${str}`;
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 员工是否离职
    isHaveDeparture() {
      this.$get(this.$Url.basicInfo.ifJobHopping, {
        companyName: this.companyName,
      })
        .then((res) => {
          // this.isLayPeople = []
          if (res.status === 505) {
            this.$message.warning("公司没有该员工");
          }
          if (res.data && res.data.length > 0) {
            let isLayPeople = res.data;
            this.isLayPeople = isLayPeople.filter((v, i, arr) => {
              return v.state === "疑似离职";
            });
            let data = res.data;
            let b = [];
            for (let i in data) {
              this.layPeople.push(data[i]);
              for (let j in data[i].dubious) {
                b.push({
                  name: data[i].name,
                  companyName: data[i].dubious[j].company,
                  startDate: data[i].dubious[j].start_date,
                  endDate: data[i].dubious[j].end_date,
                });
              }
            }
            for (let i in b) {
              // 原公司职务
              this.$get(this.$Url.basicInfo.position, {
                userName: b[i].name,
                companyName: this.companyName,
              })
                .then((res) => {
                  let data = res.data;
                  let arr = [];
                  for (let i in data) {
                    arr.push(data[i].postName);
                  }
                  this.$set(
                    b[i],
                    "position",
                    data.length > 0 ? arr.join("/") : "-"
                  );
                })
                .catch((err) => {});
              // 专利发明数量
              this.$post(this.$Url.basicInfo.patentNum, {
                ipi: 1,
                ips: 1,
                companyName: this.companyName,
                musts: {
                  inventor: b[i].name,
                },
              })
                .then((res) => {
                  let data = res.data;
                  this.$set(b[i], "patentNum", data.page.totalRow || 0);
                })
                .catch((err) => {});
            }
            this.layPeopleArr = b;
            this.rowspan(b);
          }
          if (this.isLayPeople.length <= 0) {
            this.isNoLayPeople = true;
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    rowspan(data) {
      this.spanArr = [];
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);
          this.pos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].name === data[i - 1].name) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0 || columnIndex === 1) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col,
        };
      }
    },
    headerCellStyle(row, rowIndex) {
      return {
        color: "#545c83",
        "border-color": "#d7e0f7",
        "background-color": "rgba(215,224,247,0.3)",
      };
    },
    cellStyle() {
      return {
        "border-color": "#d7e0f7",
      };
    },
    cellStyle2({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 1) {
        return "borderRight";
      }
    },
    // 工商变更
    commercialChange() {
      this.$post(this.$Url.basicInfo.commercialChange, {
        eid: this.eid,
        tid: "926a7d53ac3fa19616d50d16ad1f6e83",
        ipi: 1,
        ips: 2000,
        sort: {
          change_date: "asc",
        },
        // name: this.companyName
      })
        .then((data) => {
          if (data.data.length <= 0) {
            return;
          }
          let mock = data.data || [];
          // 数组深拷贝，防止mock数组变动
          let mock1 = mock ? JSON.parse(JSON.stringify(mock)) : [];
          // mock1.reverse()
          this.scaleData = JSON.parse(JSON.stringify(mock));
          // 分页
          if (mock.length % 5 === 0) {
            this.pageNum = mock1.length / 5;
          } else {
            this.pageNum = Math.ceil(mock1.length / 5);
          }
          for (let i = 0; i < this.pageNum; i++) {
            let itemArr = [];
            if (i < this.pageNum - 1) {
              for (let j = 0; j < 5; j++) {
                this.$set(mock1[j], "_info", mock1[j].type);

                let obj = {
                  name: mock1[j],
                };

                itemArr.push(obj);
              }
              mock1.splice(0, 5);
            } else {
              for (let j = 0; j < mock1.length; j++) {
                this.$set(mock1[j], "_info", mock1[j].type);
                let obj = {
                  name: mock1[j],
                };
                itemArr.push(obj);
              }
            }

            this.testData.push(itemArr);
          }
          setTimeout(() => {
            try {
              let pointArr = [];
              let timeLine = this.$refs.timeLine;
              let singleWidth = timeLine.offsetWidth / this.pageNum;
              this.$refs.box.style.width = singleWidth + "px";
              for (let i = 0; i < this.pageNum; i++) {
                pointArr.push(singleWidth * i);
              }
              this.drag(pointArr);
            } catch (e) {}
          }, 0);
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 拖动滑块
    drag(pointArr) {
      let timeLine = this.$refs.timeLine;
      let box = this.$refs.box;
      let that = this;
      box.onmousedown = function(ev) {
        let disX = ev.clientX - box.offsetLeft;
        document.onmousemove = function(ev) {
          // console.log(box.offsetLeft)
          let left = ev.clientX - disX;
          // 左边缘吸附
          if (left < 4) {
            box.style.left = 0;
          }
          if (left >= 0) {
            box.style.left = left + "px";
          }
          // 右边缘吸附
          if (box.offsetLeft >= timeLine.offsetWidth - box.offsetWidth - 4) {
            box.style.left = timeLine.offsetWidth - box.offsetWidth + "px";
          }
          let singleWidth = timeLine.offsetWidth / that.pageNum;
          for (let i = 0; i < pointArr.length; i++) {
            if (left >= pointArr[pointArr.length - 1]) {
              that.$refs.carousel.setActiveItem(pointArr.length - 1);
              return;
            }
            if (left >= pointArr[i] && left <= pointArr[i + 1]) {
              that.$refs.carousel.setActiveItem(i);
            }
          }
        };
        document.onmouseup = function() {
          document.onmousemove = null;
        };
      };
    },
    change(val) {
      this.sliderLeftTime = this.testData[val][0].name.change_date;
      this.sliderRightTime = this.testData[val][
        this.testData[val].length - 1
      ].name.change_date;
    },
    // 展示工商变更详情
    showDetails(item) {
      let info = item.name;
      this.contentList = []
        .concat(`时间：${info.change_date}`)
        .concat(`${info.change_item}变更：`);
      if (info.change_item.indexOf("资本") > -1) {
        this.contentList.push(`变更前：${info.before_content}`);
        this.contentList.push(`变更后：${info.after_content}`);
      } else {
        this.contentList.push(`变更前：${info.before_content}`);
        this.contentList.push(`变更后：${info.after_content}`);
      }

      if (this.contentList.length > 0) {
        this.dialogContant = true;
      } else {
        this.dialogContant = false;
        this.$message.warning("暂无详细信息");
      }
    },
    getCurrentPageBranch(val) {
      if (val) {
        this.branch.ipi = val;
        this.getBranch();
      }
    },
    //分支机构
    getBranch() {
      this.branch.loading = true;
      this.$post(this.$Url.basicInfo.selectByName, {
        eid: this.eid,
        tid: "262f70344c1d113dc1432d36e2807e3d",
        ipi: this.branch.ipi,
        ips: 5,
      })
        .then((data) => {
          this.branch.items = data.data && data.data.result;
          this.branch.total = data.data && data.data.page.totalRow;
          this.branch.loading = false;
        })
        .catch((err) => {});
      // this.$get(
      // 	`${this.$Url.basicInfo.branchPage}?ipi=${this.branch.ipi}&ips=${this.branch.ips}&eid=${this.eid}`,{
      // }).then(data => {
      // 	if(data.status ==200 && data.data){
      // 		if(data.data.result&&data.data.result.length>0){
      // 			/* var getDatas = data.data;
      // 			if(getDatas.items.length>0){
      // 				(getDatas.items).splice(0,1)
      // 			} */
      // 			this.branch.items = data.data.result
      // 		}
      // 	}
      // 	this.branch.loading = false
      // }).catch(err => {
      // 	console.log(err)
      // })
    },
    // 获取对外投资
    getInvest() {
      this.invest.loading = true;
      this.$post(this.$Url.basicInfo.selectByName, {
        eid: this.eid,
        tid: "aa0db5d0e91fb921249e31bf2bb9b43a",
        ipi: this.invest.ipi,
        ips: 5,
      })
        .then((data) => {
          this.invest.items = data.data && data.data.result;
          this.invest.total = data.data && data.data.page.totalRow;
          this.invest.loading = false;
        })
        .catch((err) => {});
    },
  },
  watch: {
    "$i18n.locale"() {
      this.introduceData = {
        title: this.$t("assessment.CompanyProfile"),
        content: "",
      };
      this.businessData = {
        title: this.$t("assessment.IndustrialAndCommercialInfo"),
        body: {},
      };
      (this.businessChange = {
        title: this.$t("assessment.IndustrialAndCommercialChanges"),
      }),
        (this.mainMember = {
          title: this.$t("assessment.KeyPersonnel"),
          body: [],
        });
    },
  },
};
</script>

<style lang="scss" scoped>
* {
  word-break: break-all !important;
}
b {
  font-weight: normal;
}
.introduce {
  position: relative;
  .i-btn {
    position: absolute;
    top: -15px;
    right: 20px;
  }
}
.basicInfo {
  width: 100%; /*min-width:1195px;*/
  overflow: hidden;
  font-size: 12px;
  color: $mainColor;
  background-color: #fff;
}
.infoTitle {
  padding-left: 25px;
  margin: 32px 0;
  font-size: 14px;
  color: $mainColor;
  font-weight: bold;
  border-left: 5px solid $mainColor;
}
.introduceContent {
  line-height: 30px;
  padding: 0 70px;
  text-align: justify;
}
/*工商信息*/
.businessBody {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  margin: 0 auto;
}
.businessBody > p,
.memberBody > p {
  display: flex;
  flex-wrap: nowrap;
  width: 33.333%;
  min-height: 57px;
  line-height: 57px;
  margin-bottom: 0;
  text-align: left;
}
.businessBody > p:last-of-type {
  height: auto;
  width: 66.65%;
}
.businessBody > p > span,
.memberBody > p > span {
  width: 35%;
  padding: 0 5px;
  line-height: 25px;
  background: $hoverColor;
  color: $mainColor;
  font-weight: bold;
  border: 1px solid #ececf5;
  border-bottom: none;
  border-left: none;
  text-align: center;
}
.memberBody > p > span {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.businessBody > p > span {
  line-height: 30px;
  padding: 15px 5px;
}
.businessBody > p:nth-of-type(3n-2) > span,
.memberBody > p:nth-of-type(3n-2) > span {
  border-left: 1px solid #ececf5;
}
.businessBody > p > b,
.memberBody > p > b {
  width: 75%;
  padding: 15px;
  color: #838895;
  text-align: justify;
  line-height: 30px;
  border: 1px solid #ececf5;
  border-bottom: none;
  border-left: none;
}
.businessBody > p:last-of-type > b {
  height: auto;
  width: 85%;
}
.businessBody > p:nth-last-child(1),
.businessBody > p:nth-last-child(2) {
  height: auto;
}
.businessBody > p:nth-last-child(1) > span {
  width: 16%;
}
.businessBody > p:nth-last-child(1) > span,
.businessBody > p:nth-last-child(1) > b,
.businessBody > p:nth-last-child(2) > span,
.businessBody > p:nth-last-child(2) > b,
.memberBody > p:nth-last-child(1) > span,
.memberBody > p:nth-last-child(1) > b,
.memberBody > p:nth-last-child(2) > span,
.memberBody > p:nth-last-child(2) > b,
.memberBody > p:nth-last-child(3) > span,
.memberBody > p:nth-last-child(3) > b {
  border-bottom: 1px solid #ececf5;
}
/*工商变更*/
.changeBody {
  position: relative;
  width: 100%;
  background: url(../img/time-line-bg.png) no-repeat center center;
  background-size: auto 70%;
}
.changeBody .title {
  position: relative;
  width: 100%;
}
.changeBody .title .time {
  display: inline-block;
  width: 340px;
  height: 50px;
  line-height: 50px;
  margin-bottom: 0;
  text-align: center;
  font-weight: 600;
  font-size: 14px;
  color: $mainColor;
  background: -webkit-linear-gradient(
    to left,
    #fafafa 0%,
    rgba(3, 179, 140,0.1) 50%,
    #fafafa 100%
  ); /* Safari 5.1 - 6.0 */
  background: -o-linear-gradient(
    to left,
    #fafafa 0%,
    rgba(3, 179, 140,0.1) 50%,
    #fafafa 100%
  ); /* Opera 11.1 - 12.0 */
  background: -moz-linear-gradient(
    to left,
    #fafafa 0%,
    rgba(3, 179, 140,0.1) 50%,
    #fafafa 100%
  ); /* Firefox 3.6 - 15 */
  background: linear-gradient(
    to left,
    #fafafa 0%,
    rgba(3, 179, 140,0.1) 50%,
    #fafafa 100%
  ); /* 标准的语法 */
}
.changeBody .title .legend {
  position: absolute;
  top: 0;
  right: 5%;
}
.changeBody .title .legend i {
  display: inline-block;
  line-height: 40px;
  padding-left: 30px;
  margin-left: 30px;
  font-style: normal;
  font-size: 12px;
  color: $mainColor;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 20px auto;
}
.changeBody .title .legend i:nth-child(1) {
  background-image: url(../img/change-01.png);
}
.changeBody .title .legend i:nth-child(2) {
  background-image: url(../img/change-02.png);
}
.elcarousel {
  position: relative;
  width: 90%;
  height: 380px;
  margin-left: 5%;
}
.card-info {
  position: absolute;
  top: 48px;
  left: 0;
  width: 26%;
  min-width: 280px;
}
.card-info .node {
  float: left;
  width: 60px;
  height: 121px;
}
.card-info .node i {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-image: url(../img/change-03.png);
  background-repeat: no-repeat;
  background-position: center 14px;
  background-size: 18px auto;
}
.card-info .node.node-bottom {
  margin-top: 14px;
}
.card-info .node i:after {
  position: absolute;
  bottom: -70px;
  left: 50%;
  width: 2px;
  margin-left: -1px;
  height: 70px;
  border-left: 2px dashed $mainColor;
  content: "";
}
.business-hide {
  display: none !important;
}
.node-top i {
  background-color: $mainColor;
}
.node-bottom i {
  background-color: $mainColor;
}
.node-bottom i:after {
  bottom: 50px !important;
  height: 84px !important;
}
.card-info .abst {
  float: left;
  width: 220px;
  margin-top: 14px;
  border-left: 2px solid $mainColor;
}
.card-info .abst p {
  line-height: 24px;
  padding-left: 10px;
  margin-bottom: 0;
  font-size: 12px;
  color: $mainColor;
}
.elcarousel-item .card-info:nth-of-type(1) {
  top: 246px;
  left: 5%;
}
.elcarousel-item .card-info:nth-of-type(2) {
  left: 20%;
}
.elcarousel-item .card-info:nth-of-type(3) {
  top: 246px;
  left: 40%;
}
.elcarousel-item .card-info:nth-of-type(4) {
  left: 55%;
}
.elcarousel-item .card-info:nth-of-type(5) {
  top: 246px;
  left: 75%;
}
.time-line {
  position: relative;
  width: 80%;
  height: 30px;
  margin-left: 10%;
  background-color: $hoverColor;
}
.time-line .scale {
  display: flex;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding-left: 0;
  list-style: none;
}
.time-line .scale li {
  position: relative;
  flex: 1;
  height: 10px;
}
.time-line .scale li:after {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 10px;
  content: "";
  background-color: #bab8de;
}
.time-line .scale li.high:after {
  height: 15px;
}
.time-line .scale li:last-child:after {
  width: 0;
}
.slider-box {
  position: absolute;
  top: 1px;
  left: 0;
  width: 60px;
  height: 28px;
  background-color: $mainColor;
}
.slider-box i {
  position: absolute;
  top: 0;
  display: block;
  width: 140px;
  line-height: 28px;
  font-style: normal;
  font-size: 12px;
}
.slider-box i:nth-child(1) {
  left: -144px;
  text-align: right;
}
.slider-box i:nth-child(2) {
  right: -144px;
  text-align: left;
}
.time-tip {
  position: relative;
  width: 90%;
  margin-top: 10px;
  margin-left: 5%;
}
.time-tip span {
  position: absolute;
  top: 0;
  display: block;
  width: 140px;
  text-align: center;
  font-size: 12px;
  color: $mainColor;
}
.time-tip span:nth-child(1) {
  left: -70px;
}
.time-tip span:nth-child(2) {
  right: -70px;
}
.content-list {
  position: relative;
  padding-left: 0;
  list-style: none;
}
.content-list li {
  display: block;
  width: 100%;
  padding: 4px 0;
  border-bottom: 1px dashed $mainColor;
  color: $mainColor;
}
.content-list li:last-child {
  border-bottom: 0;
}
.headline {
  font-size: 12px !important;
}
.abst .detail {
  font-weight: 600;
  cursor: pointer;
}
.abst .detail span {
  display: inline-block;
  margin-right: 10px;
}
.abst .detail span:hover {
  text-decoration: underline;
  color: #33334d;
}
/*主要人员*/
.memberBody {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  margin: 0 auto;
}
.memberBody > p {
  text-align: center;
}
.memberBody > p > span {
  width: 30%;
}
.memberBody > p > b {
  display: inline-flex;
  width: 70%;
  align-items: center;
  justify-content: center;
}
/*分支机构*/
.branchBody {
  width: 90%;
  margin: 0 auto 30px;
  text-align: center;
}
@media (max-width: 1900px) {
  .businessBody > p {
    height: auto;
  }
}
.right-icon {
  position: absolute;
  top: 10px;
  right: 0;
  min-width: 70px;
  padding: 0 10px;
  margin-top: 3px;
  margin-right: 0;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  background-color: $mainColor !important;
  color: #fff;
}
.conclusion-p {
  position: relative;
}
.conclusion-p i {
  font-style: normal;
  color: $mainColor;
}
.show_patent_People {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1000;
  width: 250px;
  margin-top: -100px;
  margin-left: 180px;
  padding: 15px;
  background-color: #e4e4e4;
}
.show_patent_People ul {
  list-style: none;
}
.show_patent_People ul li p {
  margin-bottom: 0;
}
.falseInfo {
  color: #f94b4e;
  cursor: default;
}
</style>
